<template>
	<view class="main">
		<view class="head-box">
			<!-- <view class="main-bg"><u--image :src="shopMallImgUrl+'bg-1.png'" width="750rpx" height="198px"></u--image></view>
			<view class="nav-bar">
				<view class="back" @click="back"><u-icon name="arrow-left" color="#606266" size="24"></u-icon></view>
				<view class="title">联盟消费券补贴</view>
			</view> -->
			<view class="Summary-box">
				<!-- <view class="sum-bg"><u--image :src="shopMallImgUrl+'bg-2.png'" width="346px" height="269px"
						radius="10px"></u--image></view> -->
				<view class="amount-box">
					<view class="total-money">
						<view class="title">消费券补贴(元)</view>
						<view class="mount-money">{{moneyInfo.currentAmount||0}}</view>
					</view>
					<view class="Summary-money">
						<view class="Summary-money-left">
							<view class="top">累计补贴（元）</view>
							<view class="bottom">{{moneyInfo.historyAmount||0}}</view>
						</view>
						<view class="Summary-money-right">
							<view class="top">待补贴金额（元）</view>
							<view class="bottom">{{moneyInfo.freezeAmount||0}}</view>
						</view>
					</view>

				</view>

			</view>
			<!-- <view class="btn-box" @click="Withdrawal">消费券提现</view> -->
		</view>
		<u-gap height="20" bgColor="#F6F6F6"></u-gap>
		<view class="list-box">
			<view class="tab-box">
				<view class="tab-li">补贴明细</view>
				<!-- <view class="tab-li" :class="{'active':cur==1}" @click="tabNav(1)">提现记录</view> -->
			</view>
			<!-- <view class="screen-plate">
				<view class="screen-time">查询时间:{{currentTime}}</view>
				<view class="screen-time-option" @tap="openData"><u-image width="32rpx" height="32rpx"
						:src="appletImgUrl+'cate_tow.png'"></u-image>
					<view class="screen-time-label">筛选</view>
				</view>
			</view> -->
			<view class="list-box" v-if="RecordList.length>0">
				<view class="li-row" v-for="(item,index) in RecordList" :key="index">
					<view class="li-row-item">
						<view class="li-row-item-li">
							<view class="li-row-item-li-label">
								时间：
							</view>
							<view class="li-row-item-li-text">
								{{item.createTime}}
							</view>
						</view>
						<view class="li-row-item-li">
							<view class="li-row-item-li-label">
								数量：
							</view>
							<view class="li-row-item-li-text">
								{{item.amount}}
							</view>
						</view>
					</view>
					<view class="li-row-item">
						<view class="li-row-item-li">
							<view class="li-row-item-li-label">
								关联单号：
							</view>
							<view class="li-row-item-li-text">
								{{item.tradeNo}}
							</view>
						</view>
						<view class="li-row-item-li">
							<view class="li-row-item-li-label">
								状态：
							</view>
							<view class="li-row-item-li-text">
								{{item.status==0?"待入账":"已到账"}}
							</view>
						</view>
					</view>
					<view class="li-row-item">
						<view class="li-row-item-li">
							<view class="li-row-item-li-label">
								方向：
							</view>
							<view class="li-row-item-li-text">
								{{item.direction=="IN"?"收入":"支出"}}
							</view>
						</view>
						<view class="li-row-item-li">
							<view class="li-row-item-li-label">
								业务类型：
							</view>
							<view class="li-row-item-li-text">
								{{getbizType(item.bizType)}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="nodata" v-else>暂无数据</view>
			<!-- <u-calendar :show="showDate" mode="range" @confirm="confirm" :allowSameDay="true" :minDate='minDate'
				:maxDate='maxDate' @close="closeDate" monthNum="60"></u-calendar> -->
		</view>
		<u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText"
			:nomore-text="nomoreText" />
	</view>

</template>

<script>
	import {
		imgUrl,
		appletImgUrl,
		shopMallImgUrl
	} from "@/common/config.js"
	import {
		getStoreData,
		setStoreData,
		httpPost,
		httpGet
	} from "@/utils/http.js";
	const date = new Date();
	const year = date.getFullYear();
	const month =
		date.getMonth() + 1 > 9 ? date.getMonth() + 1 : "0" + (date.getMonth() + 1);
	const date1 = date.getDate() > 9 ? date.getDate() : "0" + date.getDate();
	export default {
		data() {
			return {
				imgUrl: imgUrl,
				appletImgUrl: appletImgUrl,
				shopMallImgUrl: shopMallImgUrl,
				showFlag: false,
				dataArr: [],
				status: "loadmore",
				loadingText: "努力加载中",
				loadmoreText: "",
				nomoreText: "",
				listInfo: {
					pageNo: 1,
					pageSize: 10,
					pages: 0,
					total: 0,
				},
				cur: 0,
				moneyInfo: {
					currentSubsidyFee: 0,
					historySubsidyFee: 0
				},
				storeId: "",
				subsidized: 0,
				modelData: {
					pageNo: 1,
					pageSize: 10
				},
				RecordList: [],
				totalPage: 1,
				currentTime: "",
				showDate: false,
				queryData: {
					startTime: "",
					endTime: "",
					//orderType:""
				},
				public: {
					startTime: "",
					endTime: ""
				},
				minDate: "",
				maxDate: "",
				count: 0

			};
		},
		onShow() {
			this.getinfo();
			this.getRecordList();
		},
		onLoad() {
			this.getTime();
			
		},
		onReachBottom() {
			if (this.count >= 10) {
				this.status = "loading";
				this.modelData.pageNo++;
				this.getRecordList();

			} else {
				this.status = "nomore";
			}
		},
		methods: {
			getTime() {
				let now = new Date();
				let year = now.getFullYear(); // 年
				let month = now.getMonth() + 1; // 月
				let date = now.getDate(); // 日
				var lastDate = new Date(year, month, 0).getDate(); //获取当月最后一日
				if (month < 10) {
					month = "0" + month;
				}
				if (date < 10) {
					date = "0" + date;
				}

				this.public.startTime = year + "-" + month + "-01" + " 00:00:00";
				this.public.endTime = year + "-" + month + "-" + lastDate + " 23:59:59";
				this.currentTime = year + "-" + month + "-01" + "至" + year + "-" + month + "-" + lastDate;


				this.queryData.startTime = this.public.startTime;
				this.queryData.endTime = this.public.endTime;
				let minyear = year - 3;
				this.minDate = minyear + '-' + month + '-' + date;
				let maxyear = year + 3;
				this.maxDate = maxyear + '-' + month + '-' + date;
				//this.defaultDate[0] = year + '-' + month + '-' + day;

			},
			back() {
				uni.navigateBack()
			},

			getRecordList() {
				let that = this;
				httpPost("/api/union/store/consumeLogList", {
						pageNo: that.modelData.pageNo,
						pageSize: 10,
					})
					.then((res) => {
						console.log(res)
						that.count = res.data.list.length;
						that.RecordList = res.data.list;
						if (that.count >= 10) {
							that.status = "loading";
							that.nomoreText = "";
						} else {
							that.status = "nomore";
							that.nomoreText = "没有更多了";

						}

					}).catch((e) => {

					});
			},
			getinfo() {
				let that = this;
				httpGet("/api/union/store/wallet/CONSUME")
					.then((res) => {
						console.log(res)
						if (res.data) {
							that.moneyInfo = res.data
						}

					}).catch((e) => {

					});
			},
			// getStoreInfo() {
			// 	let that = this;
			// 	httpGet("/api/sellerstore/selfInfo")
			// 		.then((res) => {
			// 			that.storeId = res.data.id;
			// 			that.getResidueMoney(that.storeId);
			// 		}).catch((e) => {

			// 		});
			// },
			// getResidueMoney(storeId) {
			// 	let that = this;
			// 	httpGet("/api/sellerordersubsidysummary/info/" + storeId).then((res) => {
			// 		that.subsidized = res.data.currentAmount;
			// 	}).catch((e) => {

			// 	});
			// },
			// onReachBottom() {
			// 	if (this.listInfo.pageNo >= this.listInfo.pages) {
			// 		this.status = "nomore";
			// 		return;
			// 	} else {
			// 		this.status = "loading";
			// 		this.listInfo.pageNo++;
			// 		this.getdataFun();
			// 	}
			// },
			// getdataFun() {
			// 	const _this = this;
			// 	if (this.listInfo.pageNo === 1) {
			// 		this.dataArr = [];
			// 	}
			// 	this.nomoreText = "";
			// 	httpPost("/api/orderform/outline/listPay", {
			// 			pageNo: this.listInfo.pageNo,
			// 			pageSize: 10,
			// 		})
			// 		.then((res) => {
			// 			const result = res.data;
			// 			_this.listInfo.pages = result.totalPage;
			// 			_this.dataArr = [..._this.dataArr, ...result.list];
			// 			_this.count=result.list.length;
			// 			if (_this.count >= 10) {
			// 				_this.status = "loading";
			// 				_this.nomoreText = "";
			// 			} else {
			// 				_this.status = "nomore";
			// 				_this.nomoreText = "没有更多了";

			// 			}
			// 			console.log(_this.dataArr)
			// 			_this.showFlag = true;
			// 		}).catch((e) => {
			// 			_this.showFlag = true;
			// 		});
			// },
			// Withdrawal() {
			// 	if (this.moneyInfo.currentSubsidyFee >= 100) {
			// 		uni.navigateTo({
			// 			url: '/pages/user/my-withdrawal?type=14&name=优惠补贴&amount=' + this.moneyInfo
			// 				.currentSubsidyFee
			// 		});
			// 	} else {
			// 		uni.$u.toast("金额不足100，不能提现");
			// 	}

			// },
			// tabNav(val) {
			// 	this.cur = val;
			// },
			// openData() {
			// 	this.showDate = true;
			// },
			// confirm(e) {
			// 	console.log(e)
			// 	this.public.startTime = e[0] + ' ' + '00:00:00';
			// 	this.public.endTime = e[e.length - 1] + ' ' + '23:59:59';
			// 	this.queryData.startTime = this.public.startTime;
			// 	this.queryData.endTime = this.public.endTime;
			// 	this.currentTime = e[0] + "至" + e[e.length - 1];
			// 	this.queryData.pageNo = 1;
			// 	this.pageTotal = 1;
			// 	this.recordList = [];
			// 	this.getRecordList();
			// 	this.showDate = false;
			// },
			// closeDate() {
			// 	this.showDate = false;
			// },
			// jumpDetail(data) {
			// 	uni.navigateTo({
			// 		url: '/pages/user/subsidy-details?subsidyType' + data.subsidyType
			// 	});
			// }
		},
	};
</script>

<style lang="scss">
	.bill-box {
		display: flex;
		background: #f8f8f8;
		width: 100vw;
		min-height: 100vh;

		.no-data {
			width: 100%;
			color: #666;
			text-align: center;
			margin: 48px;
		}

		.item {
			background: #fff;
			border-radius: 4px;
			margin-bottom: 16px;
			padding: 12px 8px;

			.line {
				border-bottom: 1px solid #eee;
			}
		}

		.text-area {
			width: calc(100vw - 32px);
			color: #333;
			font-size: 14px;
			margin: 16px;

			.tips2 {
				color: #f00;
				text-align: right;
			}

			.title {
				line-height: 30px;
				color: #666;
				margin-left: 16px;
			}
		}

		.u-slot-title1 {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			line-height: 40px;
		}

		.u-slot-title2 {
			display: flex;
			flex-direction: column;
		}

		.total {
			width: 120px;
			height: 120px;
			display: flex;
			margin-top: 32px;
			font-size: 14px;
			color: #fff;
			justify-content: center;
			align-content: center;
			background: linear-gradient(-90deg, #f90, #f60);
			box-shadow: 6px 12px 32px 12px rgba(247, 213, 62, 0.897);
			border-radius: 50%;

			.num {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;

				.value {
					font-size: 16px;
					line-height: 30px;
				}
			}
		}
	}

	.head-box {
		position: relative;

		.nav-bar {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			height: 88rpx;
			position: absolute;
			top: 80rpx;
			width: 750rpx;
			padding-left: 20rpx;
			padding-right: 20rpx;

			.title {
				font-size: 36rpx;
				line-height: 88rpx;

				width: 622rpx;
				text-align: center;
			}

			.back {
				margin-top: 24rpx;
			}
		}

		.Summary-box {
			width: 690rpx;

			border-radius: 20rpx;
			background-color: #EF684B;
			margin-left: 30rpx;


			.Summary-money {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				font-size: 24rpx;
				color: #fff;

				.Summary-money-left {
					width: 50%;
					text-align: center;
					background-color: #f58f79;
					padding-top: 20rpx;
					padding-bottom: 20rpx;
					position: relative;
				}

				.Summary-money-right {
					width: 50%;
					text-align: center;
					background-color: #f58f79;
					padding-top: 20rpx;
					padding-bottom: 20rpx;
				}

				.bottom {
					font-size: 40rpx;
				}

				.Summary-money-left:after {
					display: block;
					content: "";
					width: 2rpx;
					background: #EF684B;
					position: absolute;
					right: 0;
					top: 22rpx;
					height: 80rpx;

				}
			}
		}

		.amount-box {

			width: 100%;
			text-align: center;

			.total-money {
				padding-top: 30rpx;
				padding-bottom: 30rpx;

				.title {
					font-size: 28rpx;
					color: #fff;
					margin-bottom: 10rpx;
				}

				.mount-money {
					font-size: 48rpx;
					font-weight: bold;
					color: #fff;
				}
			}


		}
	}

	.list-box {
		padding-left: 30rpx;
		padding-right: 30rpx;

		.tab-box {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			font-size: 32rpx;
			margin-bottom: 20rpx;

			.tab-li {
				margin-right: 40rpx;
			}
		}

		.list {
			.li-item {
				background-color: #fff;
				padding: 20rpx 30rpx;
				border-radius: 20rpx;
				margin-bottom: 20rpx;

				.li-top {
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					margin-bottom: 10rpx;

					.title {
						font-size: 32rpx;
					}
				}

				.li-bottom {
					display: flex;
					flex-direction: row;
					justify-content: flex-start;

					.tt {
						margin-right: 40rpx;
					}
				}
			}
		}
	}

	.main {
		height: calc(100vh - 20rpx);
		background-color: #F6F6F6;
		padding-top: 20rpx;
	}

	.nodata {
		text-align: center;
		color: #c5c5c5;
		padding-top: 50rpx;
	}

	.screen-plate {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		padding-left: 30rpx;
		padding-right: 30rpx;
		margin-top: 40rpx;
		margin-bottom: 20rpx;

		.screen-time-option {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;

			.screen-time-label {
				margin-left: 10rpx;
			}
		}
	}

	.btn-box {
		width: 690rpx;
		margin-left: 30rpx;
		height: 88rpx;
		line-height: 88rpx;
		border-radius: 88rpx;
		text-align: center;
		background-color: #EF684B;
		margin-top: 40rpx;
		color: #fff;
	}
</style>